<style type="text/css">
.storelogo img{width:3.2rem;height:3.2rem}
.merchgroup .store-star {padding:0.1rem 0 0.2rem 0;font-size:0.65rem;line-height:1rem}
.merchgroup .store-star img{height:0.66rem}
.star-on,.star-off{position:absolute;top:1rem;left:0;overflow:hidden}
.star-rate {margin-left:3.6rem}
.store-distance{float:right;color:#999}
.store-moneylimit{font-size:0.55rem}
.yuyue-duan {border: 1px solid #19b955;border-radius: 4px;padding:0.1rem;height:auto;width:90px;margin:8px;font-size:0.5rem;text-align:center}
.yuyue-duan span {width:100%;text-align:center}
.timeischack{background:#19b955;color:#fff}
.clear{clear:both;}
.sortmenu_sort{
    width: 100%;
    max-height: 10rem;
    background-color: #fff;
    z-index: 100000;
    position: absolute;
    top: 2rem;
    left: 0;
    border-radius: 0 0 0.2rem 0.2rem;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-shadow: 0 2px 0 rgba(0, 0, 0, 0.5);
    overflow: auto;
}
.sortmenu_sort h1{
    color: #ec660f;
    font-size: 0.7rem;
    border-bottom: 1px solid #ec660f;
    padding:0 0.5rem;
    line-height: 1.5rem;
}
.sortmenu_sort li {
    list-style: none;
    line-height: 2rem;
	color:{{main.syscolor ||'#18bc9c'}};
    text-align: left;
    padding:0 0.5rem;
    font-size:0.65rem;
    border-bottom: 1px solid #d8d8d8;
}
.store-star .star {
    color: #666;
	font-size:0.6rem;
}

.store-star .star span {
    padding: 0;
    margin: 0
}

.store-star .star .shine {
    color: #cdab6a;
}
.store-star .star .star1 {
    /*clear: both*/
}
.BMap_Marker img{border-radius:50%;width:36px;height:36px; box-shadow: 5px 10px 10px rgba(0, 0, 0, 0.5);}
.syscolor{color:#cdab6a}
.sysbgcolor{background-color:#cdab6a}
.jyui_cell_col .colchecked{background:#cdab6a;}
.weui_cells_radio .weui_check:checked + .weui_icon_checked:before {;
  color: #cdab6a;
}
.weui_cells_radio2 .weui_check:checked + .weui_icon_checked:before {
  color: #cdab6a;
}
.yuyue-duan {border: 1px solid #cdab6a;}
.timeischack{background:#cdab6a;}
.weui_btn_primary {
  background-color: #cdab6a;
}
</style>
<div class="fui-page page-goods-list" ng-if="pagedata.op == 'main'">
	<div class="fui-content">
		<div id="allmap" style="height: 11rem;padding:0px 0px;"></div>
		<div class="sort" style="top:0">
			<div class="item on" style="width:2%" ng-click="toogle(pagedata,'showpaixu')"><span class='text'>{{pagedata.ordertitle||'按距离排序'}}</span> <i ng-if="!pagedata.showpaixu" class="icon jinyunicon icon-moreunfold"></i> <i ng-if="pagedata.showpaixu" class="icon jinyunicon icon-less"></i></div>
			<div ng-class="{'item':1,'on':pagedata.params.status==1}" ng-click="pagedata.selectget(1,pagedata.params.order)"><span class='text'>可接单</span></div>
			<div ng-class="{'item':1,'on':pagedata.params.status==2}" ng-click="pagedata.selectget(2,pagedata.params.order)"><span class='text'>服务中</span></div>
			<div ng-class="{'item':1,'on':pagedata.params.status==3}" ng-click="pagedata.selectget(3,pagedata.params.order)"><span class='text'>不可接单</span></div>
			<div class="sortmenu_sort" ng-if="pagedata.showpaixu">
				 <ul>
					   <li ng-click="pagedata.showpaixu=false;pagedata.ordertitle='按距离排序';pagedata.selectget(pagedata.params.status,'default')">按距离排序 <i ng-if="pagedata.params.order=='default'" class="icon icon-selected" style="font-size:1rem;float:right;{{main.syscolor ||'#18bc9c'}}"></i></li>
					   <li ng-click="pagedata.showpaixu=false;pagedata.ordertitle='按星级排序';pagedata.selectget(pagedata.params.status,'star')">按星级排序 <i ng-if="pagedata.params.order=='star'" class="icon icon-selected" style="font-size:1rem;float:right;{{main.syscolor ||'#18bc9c'}}"></i></li>
					   <li ng-click="pagedata.showpaixu=false;pagedata.ordertitle='按接单量排序';pagedata.selectget(pagedata.params.status,'sales')">按接单量排序 <i ng-if="pagedata.params.order=='sales'" class="icon icon-selected" style="font-size:1rem;float:right;{{main.syscolor ||'#18bc9c'}}"></i></li>
					   <li ng-click="pagedata.showpaixu=false;pagedata.ordertitle='按浏览量排序';pagedata.selectget(pagedata.params.status,'looks')">按浏览量排序 <i ng-if="pagedata.params.order=='looks'" class="icon icon-selected" style="font-size:1rem;float:right;{{main.syscolor ||'#18bc9c'}}"></i></li>
				 </ul>
			</div>
		</div>
		<div ng-if="pagedata.list.length>0" class="fui-list-group merchgroup" style="background:none;padding:0 0.5rem" ng-repeat="item in pagedata.list">
            <div class="fui-list" style="background:#fff;border-radius:0.5rem;">
                <a class="fui-list-media storelogo" href="javascript:;" ng-click="access_json('jy_qiuyuyue/worker/detail/id='+item.id)">
                    <div style="width:100%;text-align:center">
						<div style="width:3rem;margin:0 auto"><img class="round" style="border-radius:50%;height:3rem;width:3rem" ng-src="{{tomedia(item.headimg) || '../core/resource/images/nopic.jpg'}}"></div>
						<div class="jylabel jylabel-primary active" style="border-radius:2rem;margin-top:0.3rem;font-size:0.6rem;border: 1px solid {{main.syscolor ||'#cdab6a'}};background-color:{{main.syscolor ||'#cdab6a'}};width:100%">{{item.statustitle}}</div>
					</div>
                </a>
                <a class="fui-list-inner" style="margin-top:0.16rem" href="javascript:;" ng-click="access_json('jy_qiuyuyue/worker/detail/id='+item.id)">
                    <div class="title" style="font-size:0.7rem">{{item.name}} <i ng-if="item.sex!=1" class="icon icon-nv"></i><i ng-if="item.sex==1" class="icon icon-nan"></i></div>
                    <div class="store-star" style="border-bottom: 1px solid #f1f1f1;">
						<span class="star star1">
									<span ng-class="{'shine':item.stars >= 1}"><i class="icon icon-shoucang-tianchong"></i></span>
									<span ng-class="{'shine':item.stars >= 2}"><i class="icon icon-shoucang-tianchong"></i></span>
									<span ng-class="{'shine':item.stars >= 3}"><i class="icon icon-shoucang-tianchong"></i></span>
									<span ng-class="{'shine':item.stars >= 4}"><i class="icon icon-shoucang-tianchong"></i></span>
									<span ng-class="{'shine':item.stars >= 5}"><i class="icon icon-shoucang-tianchong"></i></span>
						</span>
						<span class="r-f" style="margin-left:2rem;"><span style="margin-right:1rem"><span class="syscolor">{{item.salse ||'0'}}</span>单</span><span class="r">围观量：{{item.looks ||'0'}}</span></span>
					</div>
					<div class="title" style="margin-top:0.3rem;height:auto;width:100%">
						<span ng-repeat="t in item.tags" class="jylabels jylabel-gray" style="margin:0.2rem;border: 1px solid #666;color:#666;border-radius:0.2rem;line-height:0.8rem;padding: 0.1rem 0.3rem;">{{t}}</span>
					</div>
					<div class="subtitle" style="padding-top:0.3rem;font-size:0.55rem">
						<div class="store-moneylimit syscolor r">
							<i class="icon icon-map"></i> {{item.juli || 2.1}}KM
						</div>
					</div>
                </a>
            </div>
		</div>
		<div ng-show="pagedata.loading" class='infinite-loading'><span class='fui-preloader'></span><span style="margin-left:1.5rem"> 正在加载...</span></div>
	</div>
</div>
<div class="fui-page" ng-if="pagedata.op == 'detail'">
<div class="fui-content">
		<div id="carousel-container" class="carousel slide" data-role="carousel" data-param-auto="true">
			<div ng-if="!pagedata.worker.video || pagedata.isvideo!=1" class="carousel-inner" role="listbox" style="height:auto">
				<div ng-class="{'item':1,'active':$index==0}" ng-repeat="item in pagedata.worker.hdps">
					<a href="#">
						<img src="{{tomedia(item.picurl) || '../core/resource/images/banner-1.jpg'}}" style="display: block; width: 100%; height: 100%;">
					</a>
				</div>
			</div>
			<style>
					.fui-swipe-page .fui-swipe-bullet {background: {background}; opacity: {opacity};}
					.fui-swipe-page .fui-swipe-bullet.active {opacity: 1;}
			</style>
			<div ng-if="!pagedata.worker.video || pagedata.isvideo!=1" id="carousel-jinyun" class="fui-swipe-page" style="padding: 0 5px; bottom: 10px; ">
				<div class="fui-swipe-bullet" ng-repeat="item in pagedata.worker.hdps" ng-class="{'active':$index==0}" data-target="#carousel-container" data-slide-to="{{$index}}"></div>
			</div>
			<video ng-if="pagedata.worker.video && pagedata.isvideo==1" style="width:100%;max-height:20rem" ng-src="{{tomedia(pagedata.worker.video)}}" poster="{{tomedia(pagedata.worker.headimg)}}" x5-playsinline="" playsinline="" webkit-playsinline="" preload="auto"  preload="auto" controls loop="loop">
			</video>
		</div>
		<div ng-if="pagedata.worker.video" class="isvideo" style="margin:0">
				<div style="width:6rem;margin:0 auto;">
				<span ng-class="{'videobtn':1,'active':pagedata.isvideo==1}" ng-click="pagedata.isvideo=1"><i class="icon icon-shipin1" style="font-size:0.55rem"></i> 视频</span>
				<span ng-class="{'videobtn':1,'active':pagedata.isvideo!=1}" ng-click="pagedata.isvideo=0" style="margin-left:0.5rem;"><i class="icon icon-lunbo" style="font-size:0.5rem;"></i> 近照</span>
				</div>
		</div>
		<div class="fui-line" style="width:6rem;margin:0.5rem auto 0 auto">
			<div class="text text-danger" >{{pagedata.worker.name}}</div>
		</div>
		<div class="weui_cells_title">服务项目</div>
		<div class="weui_cells weui_cells_radio2">
				<label class="weui_cell weui_check_label dashed" ng-repeat="item in pagedata.service">
					<div class="weui_cell_bd" style="padding:0">
						<img style="width:2rem;height:2rem;margin-right:5px;display:block" ng-src="{{tomedia(item.image) || '../core/resource/images/nopic.jpg'}}"/>
					</div>
					<div class="weui_cell_bd weui_cell_primary">
						<span style="float:left;width:100%" ng-model="pagedata.item.title">{{item.title}}</span>
						<span class="syscolor" style="float:left;">价格：{{item.price}}</span>
					</div>
					<div class="weui_cell_ft" href="javascript:;" ng-click="pagedata.getdata(item.id,pagedata.post.dayid);pagedata.post.serve_id=item.id;" onclick="$('#selecttaocan').modal();">
						<input type="radio" class="weui_check" name="radio1">
						<span class="weui_icon_checked"></span>
					</div>
				</label>
		</div>
		<div class="weui_cells_title">在职日期</div>
		<div ng-if="pagedata.data" class="fui-tab-scroll weui_cells_radio3 " style="height: 3.2rem;overflow-y:hidden">
			<div ng-repeat="item in pagedata.data" class="fui-icon-col">
			    <label class="jyui_cell_col">
					<div ng-class="{'coltime':1,'colchecked':pagedata.post.dayid==$index}" ng-click="pagedata.getdata(pagedata.post.serve_id,$index);pagedata.post.dayid=$index;">
						<div class="timetitle"><span>{{item.riqi}}</span></div>
						<div class="timetitle"><span>{{item.xinq}}</span></div>
					</div>
				</label>
			</div>
		</div>

		<div class="weui_cells_title" ng-if="pagedata.serve_time">请选择预约时间</div>
		<div class="weui_cells" ng-if="pagedata.serve_time">
			<div ng-repeat="row in pagedata.serve_time" ng-if="row.yuyue > 0 && row.show == 1" class="jy-3">
				<div ng-class="{'yuyue-duan':1,'timeischack':pagedata.post.timeid == $index+1}" ng-click="pagedata.post.timeid=$index+1;">
					<div>{{row.times.start}}--{{row.times.end}}</div>
					<div>(剩余{{row.yuyue}}位)</div>
					<div class="clear"></div>
				</div>
			</div>
			<div ng-repeat="row in pagedata.serve_time" ng-if="row.yuyue == 0 ||  row.show == 0" class="jy-3 disabled">
				<div class="yuyue-duan">
					<div>{{row.times.start}}--{{row.times.end}}</div>
					<div>(剩余{{row.yuyue}}位)</div>
					<div class="clear"></div>
				</div>
			</div>
		</div>
		<div class="weui_btn_area">
			 <a class="weui_btn weui_btn_primary" href="javascript:"  ng-click="pagedata.check_buy()">立即预约</a>
		</div>
</div>
	<div id="selecttaocan" class="modal fade">
					<div class="modal-dialog" style="width:90%;bottom:40%;left:5%;">
						<div class="modal-content" style="border-radius: 4px;">
								<div aria-hidden="true" data-dismiss="modal" class="closebtn"><i class="icon jinyunicon icon-close"></i></div>
								<div class="fui-line" style="width:6rem;margin:0.5rem auto 0 auto">
									<div class="text text-danger" style="background-color:#fff" >选择套餐</div>
								</div>
								<div class="jy-3" ng-repeat="row in pagedata.package" aria-hidden="true" data-dismiss="modal">
										<div ng-class="{'yuyue-duan':1,'timeischack':pagedata.post.packageid == $index+1}" ng-click="pagedata.post.packageid=$index+1;">
											<div>{{row.package_title}}--￥{{row.package_price}}</div>
											<div class="clear"></div>
										</div>
								</div>
								<div class="clear"></div>
						</div>
					</div>
	</div>
</div>
<div class="fui-page" ng-if="pagedata.op == 'info'">
<div class="fui-content">
		<div class="fe-mod-9" style="height:11rem;min-height:6rem">
			 <div id="l-map" style="height: 11rem;padding:0px 0px;"></div>
			<div class="group-top" style="background:rgba(0,0,0,0.3);position: absolute;top:7rem;width:100%">
			 <div class="fui-list jump text-center">
				  <a class="fui-list-inner">
					 <div class="title c" style="color: #fff;margin:0.8rem 0 0.3rem 0">{{pagedata.worker.name}}</div>
					 <div class="subtitle" style="color: #fff;font-size:0.55rem">已服务：{{pagedata.worker.salses || 0}}次 | 围观人数：{{pagedata.worker.looks || 0}}</div>
					 <div class="subtitle" style="color: #f60;font-size:0.4rem">{{pagedata.worker.desc}}</div>
				   </a>
			  </div>
			</div>
			<div class="fe-mod-9-shoplogo" style="top:4rem"> 
				<div class="fe-mod-9-shoplogo-img" style="">
					<img src="{{tomedia(pagedata.worker.headimg) || '../core/resource/images/nopic.jpg'}}">
				</div>
			</div>
		</div>
</div>
</div>
<div ng-include="sys_html('_footer')"></div>
<script type="text/javascript">
    // 百度地图API功能
	scope.pagedata.getlocation=function(item){
		window.scope.location(function(re){
			item.data={};
				item.data.province = re.addressComponents.province
				item.data.city = re.addressComponents.city
				item.data.district = re.addressComponents.district
			scope.$evalAsync();
		});
	}
scope.pagedata.check_buy=function(){
	var serve_id=scope.pagedata.post.serve_id
	var worker_id=scope.pagedata.post.worker_id
	var store_id=scope.pagedata.post.store_id
	var packageid=scope.pagedata.post.packageid
	var timeid=scope.pagedata.post.timeid
	var dayid=scope.pagedata.post.dayid
	scope.get('jy_qiuyuyue/server/check_buy/serve_id='+serve_id+'&worker_id='+worker_id+'&store_id='+store_id+'&packageid='+packageid+'&timeid='+timeid+'&dayid='+dayid,function(res){});
}
</script>
<script type="text/javascript">
scope.pagedata.post.dayid = 0;
// 百度地图API功能
if(scope.pagedata.op=='main'){
	window.scope.location(function(res){
		if(!scope.pagedata.pcd.city){
				scope.pagedata.pcd.province = res.addressComponents.province;
				scope.pagedata.pcd.city = res.addressComponents.city;
		}
		scope.pagedata.pcd.lat = res.lat_lng.lat;
		scope.pagedata.pcd.lng = res.lat_lng.lng;
		scope.tool.get_list('jy_qiuyuyue/index/getworkerlist/lat='+scope.pagedata.pcd.lat+'&lng='+scope.pagedata.pcd.lng,true,function(res){
			require(['map'], function(BMap){
				var map = new BMap.Map("allmap");
				var list=scope.pagedata.list;
				var first=scope.pagedata.list['0'];
				var post=scope.pagedata.post;
				if(first){
					var point = new BMap.Point(first['lat_lng']['lng'], first['lat_lng']['lat']);
				}else{
					var point = new BMap.Point(post['lng'], post['lat']);
				}
				map.centerAndZoom(point, 13.6);
				// 编写自定义函数,创建标注
				function addMarker(point,icon){
				  var marker = new BMap.Marker(point);
				  var icon=new BMap.Icon(icon,new BMap.Size(50,50));
				  marker.setIcon(icon);
				  map.addOverlay(marker);
				}
				for (var i = 0; i < list.length; i ++) {
					var point = new BMap.Point(list[i]['lat_lng']['lng'], list[i]['lat_lng']['lat']);
					addMarker(point,list[i].headimg);
				}
			});
		});
	});	
	scope.pagedata.scroll_bottom=function(){
		scope.tool.get_list('jy_qiuyuyue/index/getworkerlist/lat='+scope.pagedata.pcd.lat+'&lng='+scope.pagedata.pcd.lng);
	}
	scope.pagedata.selectget=function(status,order){
		order=order?order:'';
		status=status?status:'';
		scope.pagedata.params.status=status;
		scope.pagedata.params.order=order;
		scope.tool.get_list('jy_qiuyuyue/index/getworkerlist/lat='+scope.pagedata.pcd.lat+'&lng='+scope.pagedata.pcd.lng+'&order='+order+'&status='+status,true);
	}
}
scope.pagedata.getdata = function(id,dayid){
	if(!id){
		scope.message('请先选择项目！');
	}
		scope.get('jy_qiuyuyue/server/serve_time/id='+id+'&day='+dayid,function(data){
			scope.pagedata.serve_time = data.serve_time;
				
		});
		scope.get('jy_qiuyuyue/server/package/id='+id,function(data){
			scope.pagedata.package = data.package;
			scope.pagedata.post.fileds = data.post.fileds;
		
		});
}
</script>
<script>
	require(['bootstrap', 'hammer'], function($, Hammer){
		$('#carousel-container').carousel();
		var mc = new Hammer($('#carousel-container').get(0));
		mc.on("panleft", function(ev) {
			$('#carousel-container').carousel('next');
		});
		mc.on("panright", function(ev) {
			$('#carousel-container').carousel('prev');
		});
	});
</script>
	<script type="text/javascript">
scope.pagedata.openLocation=function(item){
	wx.openLocation({
	latitude: item.lat_lng.lat, // 纬度，浮点数，范围为90 ~ -90
	longitude: item.lat_lng.lng, // 经度，浮点数，范围为180 ~ -180。
		name: item.province+item.city+item.district, // 位置名
		address: item.address, // 地址详情说明
		scale: 20, // 地图缩放级别,整形值,范围从1~28。默认为最大
		infoUrl: '', // 在查看位置界面底部显示的超链接,可点击跳转
		success:function(){
			//alert(1111);
		}
	});
}
if(scope.pagedata.op!='main'){
	// 百度地图API功能
	require(['map'], function(BMap){
		var map = new BMap.Map("l-map");
		var lng=scope.pagedata.worker.lat_lng.lng ? scope.pagedata.worker.lat_lng.lng : '113.941134';
		var lat=scope.pagedata.worker.lat_lng.lat ? scope.pagedata.worker.lat_lng.lat : '22.546011';
		var point = new BMap.Point(lng, lat);
		map.centerAndZoom(point, 15);
		// 编写自定义函数,创建标注
		function addMarker(point){
		  var marker = new BMap.Marker(point);
		  map.addOverlay(marker);
		}
		addMarker(point);
	});
}
	</script>